<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>GO机网管理后台</title>
	<meta http-equiv="X-UA-Compatible" content="chrome=1,IE=edge">
	<link href="../../css/bootstrap.min.css" rel="stylesheet">
	<link href="css/nifty.min.css" rel="stylesheet">
	<link href="../../css/demo/nifty-demo-icons.min.css" rel="stylesheet">
	<link href="../../plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet">
	<link href="../../plugins/pace/pace.min.css" rel="stylesheet">
	<script src="../../plugins/pace/pace.min.js?2016/8/5"></script>
	<script src="../../js/jquery-2.2.1.min.js"></script>
	
	<style>
		#table div{
			padding: 5px;
			margin: 0;
			color: #757575;
		}
		td{
			vertical-align: middle!important;
			
		}
		.panel.active{
			border-color: #2ac845;
		}
		img{
			width:80px;
			height:80px;
		}
		.start span:first-child{
			width:5em;
			display:inline-block;
		}
		.start span:last-child:after{
			content:"星";
		}
	</style>
</head>
<body id="main">
<div id="container" class="effect mainnav-lg">
	@@include('public/header.html')
	<div class="boxed">
		<div id="content-container">
			
			<div id="page-title" style="position: relative">
				<h1 class="page-header text-overflow">评价反馈</h1>
			</div>
			<div id="page-content">
				<div class="col-sm-12 pad-btm pad-top">
					<div class="col-sm-12 text-right">
						<button class="btn btn-primary" v-on:click="loadDatas(page-1)" v-show="page>1">上一页</button>
						<button class="btn btn-primary" v-on:click="loadDatas(page+1)" v-show="nextPage">下一页</button>
					</div>
					<table class="table table-striped" id="table">
						<tr v-for="d in datas">
							<td width="100">
								<img src="{{d.userinfo.img_url}}" alt="" />
							</td>
							<td>
								<div>
									<span v-text="d.userinfo.nickname"></span>
									-
									<span v-text="d.phone"></span>
								</div>
								<div v-text="d.content"></div>
								<div>
									<span v-text="d.ctime"></span>
									<span v-text="types[d.type]"></span>
								</div>
							</td>
							<td>
								<div class="start"><span>服务质量</span><span v-text="d.quality"></span></div>
								<div class="start"><span>安全性</span><span v-text="d.security"></span></div>
								<div class="start"><span>实用性</span><span v-text="d.practical"></span></div>
							</td>
							<td>
								<div class="start"><span>服务态度</span><span v-text="d.attitude"></span></div>
								<div class="start"><span>服务效率</span><span v-text="d.efficiency"></span></div>
								<div class="start"><span>易用性</span><span v-text="d.usability"></span></div>
							</td>
						</tr>
						<tr v-if="datas.length==0">
							<td colspan="4" style="text-align: center"><h4>没有数据</h4></td>
						</tr>
					</table>
				</div>
			</div>
		</div>
		
		<nav id="mainnav-container">
			@@include('public/left_menu.html')
		</nav>
	</div>
</div>
@@include('public/footer.html')

<script src="../../plugins/vue/vue.min.js"></script>
<script src="js/vue-validator.min.js"></script>
<script src="../../js/base.js"></script>
<script>
	var vue = new Vue({
		el:"#main",
		data:{
			datas:[],
			page:1,
			nextPage:true,
			types:{
				"2":"回收订单",
				"1":"维修订单"
			}
		},
		methods:{
			/*根据状态加载订单*/
			loadDatas:function(page){
				var thiz = this;
				$.post(apiRepair+'index.php?m=Home&c=Index&a=getAdminCommentList',{page:page},function(res){
					vue.datas = res.data;
					if(vue.datas.length==0){
						thiz.nextPage = false;
					} else {
						thiz.nextPage = true;
					}
					thiz.page = page;
				},'json');
			}
		},
		ready:function(){
			this.loadDatas(1);
		}
	});
</script>
</body>
</html>
